<div  class="col-md-6 col-md-offset-3 col-sm-6 col-sm-offset-3">
<div class="ui-portlet clearfix ">
    <div class="reg-header">            
        <h2>{{__('Sign In To Your Account')}}</h2>
    </div>

<div  id="login-form">
<style>
.reg-page {
    background: none repeat scroll 0 0 #fefefe;
    color: #555;
    padding: 10px;
}
.reg-page .input-group-addon {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    color: #bbb;min-width: 120px;text-align: left;
}
.reg-header {border-bottom: 1px solid #eee;color: #555;margin-bottom: 20px;text-align: center;}
.refresh_qrcode_mask{    position: absolute;
    left: 0;display:none;
    top: 0;
    width: 100%;background:rgba(255,255,255,0.95);
    height: 200px;
}

.refresh_qrcode_mask .fa-refresh {
    position: absolute;
    left: 50%;top: 50%;display: inline-block;
	font-size:40px;color:rgb(115,115,115);background: #FFF;
    margin-left: -30px;margin-top: -30px;
    cursor: pointer;padding: 10px;border-radius: 100%;
    width: 60px; height: 60px;
}

</style>

{{if !$is_mobile}}
      <ul class="nav nav-tabs" id="login-Tabs" role="tablist">
      	<li class="active"><a href="#tab-wechat-login" role="tab" data-toggle="tab">使用微信扫码登录</a></li>
      	<li><a href="#tab-login-form" role="tab" data-toggle="tab">使用账号登录</a></li>
      </ul>
{{/if}}
<div class="tab-content" style="margin-top: 5px;">
    {{if !$is_mobile}}
	<div role="tabpanel" id="tab-wechat-login" class="tab-pane active text-center"> 
		<div style="position: relative;text-align: center;height:200px;background-repeat: no-repeat;background-image:url(/img/ajax/circle_ball.gif);background-position:center;">
			<p><img id="wechat-qr-image" style="max-width: 200px !important;"></p>
			<div class="refresh_qrcode_mask">
                  <i title="二维码已过期，点击刷新" class="fa fa-refresh" onclick="getLoginQr();"></i>
            </div>
		</div>		
		<p class="refresh-logqr-tips" style="font-size: 14px;color: #999;">扫码关注后，自动登录</p>
	</div>
    {{/if}}
<div role="tabpanel" id="tab-login-form" class="tab-pane {{if $is_mobile}}active{{/if}}">
<form class="reg-page"  action="{{$this->Html->url('/users/login?'.$q_args)}}" id="loginform" accept-charset="utf-8"  method="post" role="form" {{if $isajax}} onsubmit="return ajaxSubmitForm(this,'loginSuccess');" {{/if}}>
                <div class="form-group help-block" id="login_errorinfo"></div>    
                
		{{if $_REQUEST['type']=='mocapcha'}}
<script>
function change_captcha(){
	$('#register-captcha').attr('src','{{$this->Html->url('/users/captcha')}}?_='+randomString(8));
}
function send_msg(dom){
	var mobile = $('#UserMobile').val();
	var captcha = $('#sms-captcha').val();
	if(mobile == '') {
		showErrorMessage("请先输入手机号");$('#register-mobile').focus();return false;
	}
	else if(captcha == '') {
		showErrorMessage("请输入图片验证码后再点击发送短信验证码");$('#sms-captcha').focus();return false;
	}
	ajaxAction('/users/send_msg/0', {mobile:mobile,captcha:captcha,skip_check:1},null,function(request){
		if(request.success){
			var time = 90;
			var send_msg_ti = setInterval(function(){				
				if(time > 0) {
					$('#btn-send-msg').attr('disabled','distabled');
					$('#btn-send-msg').val('再次发送('+time+'秒后)');
				}
				else{
					$('#btn-send-msg').removeAttr('disabled');
					$('#btn-send-msg').val('发送短信验证码');
					clearInterval(send_msg_ti);
				}
				time--;
			},1000);
		}
		else{
			change_captcha();
		}
	});
}
</script>
				<div class="form-group">
			 		<div class="input-group">
                        <span class="input-group-addon">
                            <i class="fa fa-user"></i>
                        	 手机号
                        </span>

                        <input type="hidden" name="data[User][referer]" value="{{$this->data['User']['referer']}}">
                        <input type="text" required="required" name="data[User][mobile]" id="UserMobile" class="form-control" placeholder="请输入您的手机号">
                    </div>
                </div>
                <div class="form-group">
                	<div style="margin-top:5px;">
                          	<input style="display:inline-block;width:80px;" type="text" placeholder="验证码" class="form-control" minlength="4" maxlength="4" id="sms-captcha">
                        	<a href="javascript:void(0)" title="看不清，点击换一张" onclick="change_captcha();"><img style="height:38px;" id="register-captcha" src="{{$this->Html->url('/users/captcha')}}"/></a>
                        	<input type="button" class="btn btn-default" id="btn-send-msg" value="发送短信验证码" onclick="send_msg(this);">
                    </div>
                </div>          
                <div class="form-group">                  
                    <div class="input-group">
                        <span class="input-group-addon">
                            <i class="fa fa-lock"></i>
                            短信验证码
                        </span>
                        <input type="text"  required="required" maxlength="15"  name="data[User][capcha]" class="form-control" placeholder="输入手机接收的短信验证码">
                    </div>
                </div>
		
		{{else}}
			<div class="form-group">
                    <div class="input-group">
                        <span class="input-group-addon">
                            <i class="fa fa-user"></i>
                         账户
                        </span>

                        <input type="hidden" name="data[User][referer]" value="{{$this->data['User']['referer']}}">

                        <input type="text" required="required" name="data[User][email]" id="UserEmail" class="form-control" placeholder="请输入您的注册邮箱或手机号">
                    </div>
             </div>
                <div class="form-group">                  
                    <div class="input-group">
                        <span class="input-group-addon">
                            <i class="fa fa-lock"></i>
                            {{__('Password')}}
                        </span>
                        <input type="password"  required="required" maxlength="15"  name="data[User][password]" class="form-control" placeholder="{{__('Password')}}">
                    </div>
                </div>
        {{/if}}
                <div class="form-group" style="margin-bottom: 0;">                  
                    <div class="checkbox" >
                            <label>
                              <input type="checkbox" checked="checked" name="data[User][remember_me]"  value="2592000"> {{__('Remember me')}}
                            </label>        
                        </div>
                </div>
                <div class="form-group">
                    <div class="clearfix">
                            <button type="submit" class="btn-primary btn btn-block">{{__('Login')}}</button>  
                    </div>
                </div>
                
                    <hr>
                    
                    <p>
                    	<a target="_blank" class="pull-right" href="{{$this->Html->url('/users/forgot')}}" class="color-green">{{__('Forget Your Password?')}}</a>
                    	{{__('Not registered?')}} <a href="{{$this->Html->url('/users/register')}}" target="_self" >{{__('Register')}}</a>
                    </p>
                    <p>如果无法登录或退出登录，点击这里<a href="javascript:;" onclick="return clearUserCookie();">清除Cookie</a></p>
                   
</form>  
</div> </div> 

	 <hr style="margin: 15px 0;"/>
	 
	<h4>第三方账号登录</h4>
    <p style="color:red;"><small>提示：未互相绑定的不同登录方式，账号不互通</small></p>
	 <?php if(empty($_REQUEST['state']) && $_SERVER['HTTP_HOST']=='www.135plat.com') $_REQUEST['state']='135plat';?>
      <p>
      <a onclick="window.open('http://www.135editor.com/oauth/qq/login?state={{$_REQUEST['state']}}','qqlogin','height=500,width=800,top=120,left='+(window.screen.availWidth/2-400)+',help=no,resizable=no,status=no,scroll=no');" href="javascript:;" ><img style="height: 45px;" src="/img/oauth/icon-qq.png" title="使用QQ账号登陆" class="showtooltip" ></a>
      &nbsp;
      {{if Configure::read('Weixin.qrlogin') }}
      <a onclick="window.open('http://www.135editor.com/oauth/weixin/qrlogin?state={{$_REQUEST['state']}}','weixin_qrlogin','height=500,width=800,top=120,left='+(window.screen.availWidth/2-400)+',help=no,resizable=no,status=no,scroll=no');" href="javascript:;" ><img style="height: 45px;" src="/img/oauth/icon-wechat.png" title="使用微信账号登陆" class="showtooltip" ></a> &nbsp;
      {{/if}}
      <a onclick="window.open('http://www.135editor.com/oauth/sina/login?state={{$_REQUEST['state']}}','sinalogin','height=500,width=800,top=120,left='+(window.screen.availWidth/2-400)+',help=no,resizable=no,status=no,scroll=no');" href="javascript:;" ><img style="height: 45px;" src="/img/oauth/icon-weibo.png" title="使用新浪微博账号登陆" class="showtooltip" ></a> &nbsp;
     <a onclick="window.open('http://www.135editor.com/oauth/toutiao/login?state={{$_REQUEST['state']}}','sinalogin','height=500,width=800,top=120,left='+(window.screen.availWidth/2-400)+',help=no,resizable=no,status=no,scroll=no');" href="javascript:;" ><img style="height: 45px;" src="/img/oauth/icon-toutiao.png" title="使用今日头条账号登陆" class="showtooltip" ></a>
     
      </p>
    {{if !$is_mobile}}
  <script>
  $(function(){
	  getLoginQr();
  })  
  </script>
    {{/if}}
  </div>   
  </div>                       
</div>